<template>
	<view>
		<cu-custom bgColor="bg-black" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">需求填写</block>
		</cu-custom>
		<view class="cu-form-group" @click="handCase">
			<view class="title">案件类型</view>
			<lbPicker v-model="caseValue" ref="picker2" mode="multiSelector" :list="caseArr" :level="1" @confirm="handleConfirm2"><text
				 slot="action-center">请选择</text></lbPicker>
			<view>
				{{caseName}}
				<text class="cuIcon-right">

				</text>
			</view>
		</view>
		<view class="cu-form-group" @click="handSite">
			<view class="title">案件委托地点</view>
			<!-- 	<lbPicker v-model="siteValue" ref="picker3" mode="multiSelector" :list="siteArr" :level="3" @confirm="handleConfirm3"><text
				 slot="action-center">请选择</text></lbPicker> -->
			<view>
				{{form.caseAddress==''?'请选择案件委托地点':form.caseAddress}}
				<text class="cuIcon-right">

				</text>
			</view>
		</view>

		<view class="cu-form-group my-title">
			<view class="title">委托定金</view>
			<input v-model="form.entrustPrice" placeholder="请输入您的报价" name="input"></input>
		</view>
		<view class="cu-form-group">
			<view class="title">追加<text class="text-price text-red" style="margin: 0 6upx;">10</text>元平台加急</view>
			<checkbox @click="handCheckbox" class='round yellow' :class="checked?'checked':''" :checked="checked?true:false"
			 value="checked2"></checkbox>
		</view>
		<view class="cu-form-group">
			<textarea v-model="form.caseContent" maxlength="-1" :disabled="modalName!=null" @input="textareaAInput" placeholder="请详细描述您的委托内容"></textarea>
		</view>
		<view class="sub_btn_box">
			<view class="sub_pic">
				<view class="com_pic">
					合计: ￥100.00
				</view>
				<view class="vip_pic">
					会员: ￥99.00
				</view>
			</view>
			<view class="btn-group">
				<button class="cu-btn bg-orange round shadow-blur">开通会员</button>
				<button @click="handSub" class="cu-btn bg-red round shadow-blur" style="margin-left:20upx;">立即发布</button>
			</view>
		</view>
	</view>
</template>

<script>
	import lbPicker from '../../components/lbPicker'
	import siteArr from '../../components/lbPicker/area-data-min.js'
	import {
		subPay
	} from '../../../core/utit.js'
	export default {
		components: {
			lbPicker
		},
		data() {
			return {
				form: {
					handleTypeId: '',
					caseId: '',
					caseAddress: '',
					caseContent: '',
					entrustPrice: '',
					isUrgent: ''
				},
				checked2: true,
				checked: true,
				caseValue: [],
				siteValue: [],
				picValue: [],
				siteArr: siteArr,
				picArr: [{
					value: 0,
					label: 100,
				}, {
					value: 1,
					label: 200,
				}, {
					value: 2,
					label: 300,
				}, {
					value: 3,
					label: 400,
				}, ],
				caseArr: [],
				serveName: '请选择服务类型',
				caseName: '请选择案件类型',
				siteName: '请选择案件委托地点',
				textareaAValue: "",
				picName: '请选择委托报价',
				userMsg: {}
			};
		},
		async onLoad(e) {
			this.form.handleTypeId = e.id
			if (uni.getStorageSync('USER')) {
				this.userMsg = JSON.parse(uni.getStorageSync('USER'))
			}
			let res = await this.http.getFieldList()
			res.forEach(item => {
				this.caseArr.push({
					value: item.id,
					label: item.dataValue,
				})
			})
		},
		methods: {
			handCheckbox() {
				this.checked2 = !this.checked2
			},
			handSub() {
				if (this.userMsg.identity == 2) {
					uni.showToast({
						title: '您已经是律师了,不可以发布咨询',
						icon: 'none'
					})
					return
				}
				if (uni.getStorageSync('USER')) {
					this.userMsg = JSON.parse(uni.getStorageSync('USER'))
				}
				if (this.form.caseId == '') {
					uni.showToast({
						title: '请选择案件类型',
						icon: 'none'
					});
					return
				}
				if (this.form.caseAddress == '') {
					uni.showToast({
						title: '请选择案件委托地点',
						icon: 'none'
					});
					return
				}
				if (this.form.entrustPrice == '') {
					uni.showToast({
						title: '请选择委托报价',
						icon: 'none'
					});
					return
				}
				if (this.form.caseContent == '') {
					uni.showToast({
						title: '请输入案件详情',
						icon: 'none'
					});
					return
				}
				uni.showLoading({
					title: '加载中...',
					icon: 'none'
				})
				this.form.userId = this.userMsg.id
				this.form.isUrgent = this.checked2 ? '1' : '2'
				this.http.addYuHandle(this.form).then(async res => {
					if (this.checked2) {
						await subPay(res)
					}

					uni.showToast({
						title: '发布成功',
						icon: 'none'
					})
					uni.navigateBack({

					})
					uni.hideLoading()
				})
			},
			textareaAInput(e) {
				this.textareaAValue = e.detail.value
			},
			handServe() {
				this.$refs.picker.show()
			},
			handCase() {
				this.$refs.picker2.show()
			},
			handSite() {
				let that = this
				console.log('获取位置')
				uni.chooseLocation({
					success: function(res) {
						that.form.caseAddress = res.address
						console.log(res.address, 'res')
					}
				});
				// this.$refs.picker3.show()
			},
			handPic() {
				this.$refs.picker4.show()
			},
			handleConfirm3(item) {
				console.log(item)
				this.siteName = []
				item.item.forEach(ele => {
					this.siteName.push(ele.label)
				})
				this.siteName = this.siteName.join('-')
				this.form.caseAddress = this.siteName
			},
			handleConfirm(item) {
				this.serveName = item.item[0].label
			},
			handleConfirm4(item) {
				this.picName = item.item[0].label
				this.form.entrustPrice = item.item[0].label
				console.log(this.form)
			},
			handleConfirm2(item) {
				this.caseName = item.item[0].label
				this.form.caseId = item.item[0].value
				console.log(item.item)
			},
		}
	}
</script>

<style lang="scss">
	.sub_btn_box {
		width: 100%;
		height: 154upx;
		padding: 0 30upx;
		background: rgba(255, 255, 255, 1);
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: fixed;
		bottom: 0;
		box-sizing: border-box;

		.btns {
			display: flex;

		}

		.sub_pic {
			.com_pic {
				color: #323233;
				font-size: 32upx;
				font-weight: bold;
			}

			.vip_pic {
				color: #E02020;
				font-size: 30upx;
				margin-top: 12upx;
			}
		}
	}
</style>
